<template>
	<div class="app-container">
		<el-table
      :data="list"
      style="width: 100%">
      <el-table-column
        prop="id"
        label="ID"
        width="180">
      </el-table-column>
      <el-table-column
        prop="cardName"
        label="名称"
        width="180">
      </el-table-column>
      <el-table-column
        prop="totalNum"
        label="账号总量"
        width="180">
      </el-table-column>
      <el-table-column
        prop="remainNum"
        label="剩余量">
      </el-table-column>
      <el-table-column
        prop="createTime"
        label="创建时间">
      </el-table-column>
      <el-table-column
        prop="authTime"
        label="到期时间">
      </el-table-column>
      <el-table-column label="操作" align="center" width="400px">
			<template slot-scope="scope">
				<el-button size="mini" type="primary" @click="openCourse(scope.row)">开通课程</el-button>
			</template>
		</el-table-column>
    </el-table>
	</div>
</template>

<script>
	import {getCardList} from '@/api/company'
	export default {
		name:"studyCard",
	data() {
		return {
			companyId:"",
			list: []
		}
	},
	created() {
		let companyId = this.$route.query.companyId;
		this.companyId = companyId;
		this.getCardList(companyId)
	},
	methods: {
		getCardList(id) {
			getCardList(id).then((res) => {
				this.list = [...res.entity];
			})
		},
		openCourse(row){
			this.$router.push({
				path:"/companyCardOpen/cardOpenCourse",
				query:{
					companyId:this.companyId,
					cardRecordId:row.id
				}
			})
		}
	}
}</script>

<style>
</style>